// 定义 ListRender 的 props 类型
export interface ListProps {
	list: string[];
	name?: string;
}

// ListItem 是一个独立的 React 组件
const ListItem = ({ people } : { people: string[] }) => {
	return (
		<>
			{people.map((person, index) => (
				<li key={index}>{person}</li>
			))}
		</>
	);
};


// 主组件 ListRender
const ListRender = ({ name, list } : ListProps) => {
	return (
		<ul>
			{name && <li>{name}</li>}
			<ListItem people={list} />
		</ul>
	);
};

export default ListRender;
